import React from "react";
import "./mine.less";
const bg1 = require("@/assets/images/user/bj_1.png");
const avatar = require("@/assets/images/user/avatar.png");
const collect_3 = require("@/assets/images/user/collect_3.png");
const note_1 = require("@/assets/images/user/note_1.png");
const data_me = require("@/assets/images/user/data_me.png");
const examination_me = require("@/assets/images/user/examination_me.png");
const MyProfile = require("@/assets/images/user/My Profile.png");
const Notice = require("@/assets/images/user/Notice.png");
const About = require("@/assets/images/user/About us.png");
export default function Mine() {
  return (
    <div className="mine">
      <div className="one">
        <img src={bg1} alt="" className="img" />
        <h5 className="first">个人中心</h5>
        <img src={avatar} alt="" className="img1" />
      </div>
      <h4 className="title">iKun</h4>
      <div className="flex">
        <div>
          <img src={collect_3} alt="" />
          <span>3</span>
          <span className="txt">收藏</span>
        </div>
        <div className="flex2">
          <img src={note_1} alt="" />
          <span>1</span>
          <span className="txt">笔记</span>
        </div>
        <div>
          <img src={examination_me} alt="" />
          <span>3</span>
          <span className="txt">我的考试</span>
        </div>
        <div>
          <img src={data_me} alt="" />
          <span>3</span>
          <span className="txt">学习资料</span>
        </div>
      </div>
      <div className="bottom">
        <div className="action">
          <img src={MyProfile} alt="" />
          <h4>我的资料</h4>
          <span>&gt; </span>
        </div>
        <div className="action">
          <img src={Notice} alt="" />
          <h4>系统公告</h4>
          <span>&gt; </span>
        </div>
        <div className="action">
          <img src={About} alt="" />
          <h4>关于我们</h4>
          <span>&gt; </span>
        </div>
      </div>
    </div>
  );
}
